<template>
  <a-card title="我的退款单">
    <a-tabs @change="onTabs">
      <a-tab-pane key="1" tab="全部退款单"></a-tab-pane>
      <a-tab-pane key="2" tab="待审核"></a-tab-pane>
      <a-tab-pane key="3" tab="已审核"></a-tab-pane>
      <a-tab-pane key="4" tab="退款中"></a-tab-pane>
      <a-tab-pane key="5" tab="退款完成"></a-tab-pane>
      <a-tab-pane key="6" tab="退款驳回"></a-tab-pane>
      <template slot="tabBarExtraContent">
        <a-input-search placeholder="商品名称/订单编号" style="width: 250px" />
      </template>
    </a-tabs>
    <div class="table-operator">
      <a-empty>
        <span slot="description"> 暂无退款订单~~ </span>
      </a-empty>
<!--      <s-table-->
<!--        ref="table"-->
<!--        size="middle"-->
<!--        :columns="refundColumns"-->
<!--        :data="refundData"-->
<!--      >-->
<!--      </s-table>-->
    </div>
  </a-card>
</template>

<script>
import { STable } from '@/components'
// import { getRefundList } from '@/api/order'

export default {
  components: {
    STable
  },
  name: 'RefundList',
  data () {
    // const refundColumns = [
    //   {
    //     title: '退款单号'
    //   },
    //   {
    //     title: '订单信息'
    //   },
    //   {
    //     title: '申请时间'
    //   },
    //   {
    //     title: '退款金额'
    //   },
    //   {
    //     title: '状态'
    //   },
    //   {
    //     title: '操作'
    //   }
    // ]
    return {
      // refundColumns,
      // refundData: parameters => {
      //   return getRefundList(Object.assign(parameters, this.queryParam)).then(res => {
      //     return res.result
      //   })
      // },
      queryParam: {}
    }
  },
  methods: {
    onTabs () {
      this.$refs.table.refresh(true)
    }
  }
}
</script>

<style scoped>
/deep/ .ant-tabs-nav .ant-tabs-tab-active {
  color: #f00
}
/deep/ .ant-tabs-ink-bar {
  height: 1px;
  background: #f00;
}
/deep/ .ant-table-middle > .ant-table-content > .ant-table-body > table > .ant-table-thead > tr > th {
  padding: 5px 8px;
}
/deep/ .ant-table-thead > tr > th {
  text-align: center;
}
</style>
